<!DOCTYPE html>
<html lang='en'>
<head>
<meta charset='UTF-8'>
<meta name='viewport' content='width=device-width, initial-scale=1.0'>
<title>01v-model</title>
</head>
<body>

  <div id='app'>
    <input type="text" v-model="inputTxt">
    {{ inputTxt }}
    <!-- 复选框1 -->
    <input type="checkbox" v-model="isChecked">
    {{ isChecked }}
    <!-- 复选框2 -->
    <hr>
    <input type="checkbox" value="唐僧" v-model="arr"> 唐僧
    <input type="checkbox" value="孙悟空" v-model="arr"> 孙悟空
    <input type="checkbox" value="猪八戒" v-model="arr"> 猪八戒
    <input type="checkbox" value="沙僧" v-model="arr"> 沙僧
    {{ arr }}
    <hr>
    <select multiple v-model="sltValue">
      <option >篮球</option>
      <option >足球</option>
      <option >乒乓球</option>
      <!-- <option value="bsk">篮球</option>
      <option value="ftb">足球</option>
      <option value="ppb">乒乓球</option> -->
    </select>
    {{ sltValue }}
  </div>

<script src='https://cdn.bootcdn.net/ajax/libs/vue/2.6.12/vue.js'></script>
<script>
  const app = new Vue({
    el: '#app'
    ,data:{
      inputTxt: "我是初始值"
      ,isChecked: true
      ,arr: []
      ,sltValue: []
    }
  })
</script>
</body>
</html>